<template>
  <div class="question" @click="goto">
    <div class="title">哈喽，烤的时候膨胀到手掌那么大，烤好回缩怎么回事？</div>
    <div class="content">
      面粉是不是搅拌过度了？面粉是不是搅拌过度了？面粉是不是搅拌过度了？面粉是不是搅拌过度了？
    </div>
    <van-divider
      :style="{ borderColor: '#ccc', margin: '10px 0 0' }"
    ></van-divider>
  </div>
</template>

<script>
export default {
  methods: {
    goto() {
      this.$router.push(`/answer/${1}`);
    },
  },
};
</script>

<style lang="scss" scoped>
.question {
  background-color: #fff;
  padding: 15px 15px 0;
}
.title {
  font-size: 18px;
  font-weight: bold;
  color: #4a4945;
  line-height: 25px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.content {
  font-size: 14px;
  color: #4a4945;
  line-height: 20px;
  margin-top: 5px;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  text-overflow: ellipsis;
  word-wrap: break-word;
  word-break: break-all;
  overflow: hidden;
}
</style>
